import React, { Component } from 'react'

export default class Tab extends Component {
    state = {
        tab: ["语文", "数学", "英语"],
        count: this.props.check
    }
    changeCount = (count) => {
        this.setState({
            count
        })
    }
    
    render() {
        const { tab, count } = this.state
        const { list, check } = this.props
        return (
            <div>
                <div className="tab">
                    {
                        list.map((item, index) => {
                            return <span 
                                        className = { index === count? 'active': '' } 
                                        onClick = { () => {
                                            this.changeCount(index)
                                        } }
                                        key = { index }>
                                { item }
                            </span>
                        })
                    }
                </div>
                <div>
                    { list[count] }
                </div>
            </div>
        )
    }
}
